将 HTML 文件无误上传到 WordPress 的 6 种方法 您所在的位置:网站首页 跪求Discuzx2高手告知将相应图片文件上传到 staticimagecommon 将 HTML 文件无误上传到 WordPress 的 6 种方法

将 HTML 文件无误上传到 WordPress 的 6 种方法

2024-05-18 19:27| 来源: 网络整理| 查看: 265

将 HTML 文件上传到 WordPress 对于大多数 WordPress 用户来说并不是一项例行任务。 由于 WordPress 允许您在不修改代码的情况下创建内容,因此您无需上传任何自定义 HTML 文件。

但是,在构建和发展您的 WordPress 网站时,有时您会需要自定义内容。 这就是 HTML 文件和页面派上用场的地方。 将它们导入您的站点将为您节省大量时间来创建自定义元素和从头开始配置设置。

本文将详细讨论该问题以及如何将 HTML 文件上传到 WordPress。 不要错过!

什么是 HTML 文件? 什么是 HTML 模板? 为什么要将 HTML 文件上传到 WordPress? #1 使用 WordPress 管理面板导入 HTML 文件#2 使用 FTP 客户端上传 HTML 文件#3 通过 cPanel 将 HTML 文件连接到 WordPress #4 将 HTML 应用于 WordPress 转换器插件#5 使用在线免费工具将 HTML 转换为 WordPress #6 将 HTML 文件上传到 WordPress 以进行 Google 验证保护 HTML 文件和页面什么是 HTML 文件?

HTML 代表超文本标记语言,它是一种用于创建和构建电子文档或网页的语言。 事实上,现在您在 Internet 上浏览的大多数网页都是使用 HTML 代码编写的。

HTML 文件是纯文本文档。 它们包含负责确保您的网站内容和图像的格式和显示正确的代码。 换句话说,HTML 帮助网络浏览器了解如何为访问者可视化您的网站结构。

pda-upload-html-files-to-wordpress-example

HTML 为您的网页创建了基础。 您可以自己生成 HTML 文件,或将现有文件(如 Google 文档)转换为 HTML。 可以插入一些 CSS 代码来向基础添加一些自定义设计元素。 这样,您的网站对于网站访问者来说将显得完美。

什么是 HTML 模板?

HTML 模板是指预先设计好的 HTML 文件,您可以轻松地将其上传到您的站点并使用。 它包括文本、图像、字体样式和 JavaScript。

对于没有编码基础的人,最好将一个已经做好的HTML模板上传到WordPress。 多亏了 HTML 模板,您可以开发吸引人的网页,而不必担心破坏您网站的结构。

在使用 HTML 模板和 WordPress 主题之前,您应该了解它们之间的一些差异。

HTML 模板WordPress主题格式独立的 zip 文件。 独立的 zip 文件。 影响您网站上单个网页的外观。 整个网站的外观。 为什么要将 HTML 文件上传到 WordPress?

如上所述,WordPress 使您无需编码即可构建网页。 但是,有时您需要使用 HTML 文件的原因有多种。

节省时间的方法:您已经为您的旧网站编写了一个很棒的 HTML 模板。 为您的新网站从头开始重建它会花费您的时间和精力。 因此,建议重复使用现有模板以节省时间,同时确保一切看起来都很完美。

此外,这也消除了人为错误的风险,因为您可以通过 HTML 文件完全上传内容。

自定义布局:将 HTML 文件上传到 WordPress 的另一个优势是高度可定制的布局。 它允许您在主题支持之外根据自己的喜好自定义内容。 您可以使用现成的 HTML 文件或自己编写并简单地上传到您的站点。

网站验证:最后但同样重要的是,将 HTML 文件上传到 WordPress 可以帮助您进行网站验证。 例如,您必须将 HTML 验证文件上传到您的站点才能使用 Google Search Console 工具。 这使 Google 能够正确访问和索引您的网站。

如何将 HTML 文件上传到 WordPress

您已经了解了有关 HTML 文件的所有知识。 现在,让我们来看看如何将 HTML 文件上传到 WordPress。

继续阅读!

#1 使用 WordPress 管理面板导入 HTML 文件

内置的 WordPress 仪表板允许您直接通过您的帖子、页面或媒体库上传 HTML 文件。 如果您使用的是古腾堡编辑器,首先您需要插入一个文件块。 然后,选择上传将 HTML 文件添加到 WordPress。

pda-gutenberg-文件块

或者,古腾堡编辑器还为您提供了自定义 HTML块。 您可以手动将 HTML 代码复制并粘贴到此块中。 但是,对于大文件上传,使用文件选项会更容易、更有效。

pda-custom-html-块

如果您使用的是经典编辑器,请在您的帖子、页面或媒体库中按添加媒体按钮。 之后,单击上传以上传您的 HTML 文件。

pda-wordpress-添加媒体按钮

小注意:有时您在使用管理仪表板将 HTML 文件上传到 WordPress 时可能会遇到错误。 最常见的问题是“抱歉,出于安全原因不允许使用此文件类型”。

出现此问题是因为您的 WordPress 站点当前不支持 .html 文件类型。 要允许在 WordPress 中进行未经过滤的上传,请查看我们的指南以了解更多详细信息。

#2 使用 FTP 客户端上传 HTML 文件

当您希望在本地测试站点上工作时,使用 FTP 客户端上传 HTML 文件会很有帮助。 它可以帮助您测试您在网站上线之前所做的任何更改。 此外,如果出现问题,这可以防止不必要的停机。

在本节中,我们将向您介绍如何使用 FileZilla 将 HTML 文件上传到 WordPress。 要开始,请按照以下说明操作:

备份您的网站。 输入凭据后,打开 FileZilla 并选择Quickconnect 。

pda-upload-html-files-to-wordpress-using-filezilla

3. 导航到您网站的根文件夹。

4. 找到并右键单击您要从计算机上传的 HTML 文件。 然后点击上传将其添加到您的网站。

成功上传文件后,检查它是否正确显示在您的网站上。 为此,请在浏览器中输入您网站的 URL 和末尾的 HTML 文件名称。 例如, www.pdagold.com/html-file 。 如果成功,您将被重定向到您使用 HTML 文件构建的新网页。

#3 通过 cPanel 将 HTML 文件连接到 WordPress

我们要与您分享的最后一种方法是使用 cPanel。 首先,登录到您的主机帐户的 cPanel 并选择文件管理器工具。

pda-cpanel-file-manager-upload-html-files-to-wordpress

现在,您有 2 个选择:

将 HTML 文件直接上传到您的根文件夹。 创建一个新文件夹并将 HTML 文件上传到其中。

使用第一种技术,您必须将 HTML 文件解压缩到您保存它的位置。 然后将index.html文件夹更改为新文件夹。 最后,重新压缩文件以继续将其上传到 WordPress。 如果您不严格遵循这些步骤,HTML 模板将覆盖您网站的主页。

我们强烈推荐第二种技术,以确保您不会破坏您的网站:

前往您网站的public_html文件夹。

pda-upload-html-files-wordpress-public-html-文件夹

2. 选择新建文件夹。

pda-create-new-folder-upload-html-file-to-wordpress-cpanel

3. 为您的新文件夹命名并点击创建新文件夹。

4. 双击您刚刚创建的文件夹并选择上传以选择您的 HTML 文件。

pda-upload-html-files-to-wordpress-cpanel

5. 您压缩的 HTML 文件将出现在文件夹中。 只需右键单击并选择Extract即可解压缩 HTML 文件。

pda-extract-html-file-cpanel

6. 选择Extract Files完成文件解压缩过程。

7. 检查文件是否已按照方法#2 的指导成功上传。

如果您遇到 404 错误,很可能是您的服务器不支持index.php重定向。 在这种情况下,返回文件管理器并访问您的.htaccess文件。 然后,插入以下代码并保存更改:

重写规则 ^(.*)index\.(php|html?)$ /$1 [R=301,NC,L]

此代码有助于重定向您的index.php文件并将其加载到浏览器中。 结果,404 错误将消失。

#4 将 HTML 应用于 WordPress 转换器插件

这种方法适合初学者,因为它不需要任何编码技能。 您的工作是激活所选的插件,它会为您处理剩下的事情。

许多可用的插件让您无需编写任何代码即可上传 HTML 并将其转换为 WordPress 内容。 不用再担心编码。 为了您的方便,我们将列表缩小到 7 个最佳插件。

让我们来看看吧!

插件推荐

插入 HTML 片段:将 HTML、CSS 和 JavaScript 代码转换为短代码,并将您的片段集成到 WordPress 页面和小部件中。

简单站点地图:创建响应式 HTML 站点地图并直接在编辑器中预览,无需复杂的简码。

原始 HTML:在您的帖子中启用原始 HTML 或任何其他代码,并禁用智能引号和自动格式化。

WP 代码:使用条件逻辑将 PHP 代码片段、页眉和页脚脚本以及广告像素代码插入 WordPress。

WP Coder:将自定义 CSS、HTML 和 JavaScript 添加到您的网页。

在类别描述中允许 HTML:通过禁用选定的 WordPress 过滤器,使您能够在类别描述中应用未过滤的 HTML。

代码嵌入:提供一种简单、高效的方式将 JavaScript 和 HTML 等代码嵌入到您的帖子和页面中。

插件说明

在本教程中,我们将指导您如何使用 WP Coder 插件插入自定义 HTML 代码和文件。

pda-wp-coder-upload-html-to-wordpress

它是这样工作的:

安装并激活插件。 在您的 WordPress 管理仪表板中,导航至Wow Plugins → WP Coder 。 要添加新的 HTML 代码,请将其复制并粘贴到添加新选项卡下的HTML 代码部分。

pda-wp-coder-html-代码

或者,您可以转到“包含文件”菜单。 将您上传到媒体库的 HTML 文件的 URL 复制并粘贴到文件 URL框中。 然后,单击添加新完成。

pda-wp-coder-plugin-upload-html-file-to-wordpress

4. 点击保存按钮并复制在发布部分生成的简码。

pda-wp-coder-copy-shortcode

5. 将短代码粘贴到页面上您想要的任何位置并享受结果。

#5 使用在线免费工具将 HTML 转换为 WordPress

要使用在线工具将 HTML 转换为 WordPress:

转到 htmltowordpress 网站。 将您网站的 HTML zip 文件上传到框中。

pda-upload-html-file-to-wordpress-在线工具

3. 您将能够预览您的 WordPress 网站。 按页面顶部的自定义按钮。

pda-wordpress-主题预览

4. 根据您的喜好修改网站。

5. 点击保存并发布完成。

#6 将 HTML 文件上传到 WordPress 以进行 Google 验证

我们将向您展示如何将 HTML 验证文件上传到 WordPress。 这是路线:

前往 Google Search Console 并点击Start now 。 输入您的 Gmail 帐户的用户名和密码。 使用其域名或URL 前缀验证您的网站。 域选项仅支持 DNS 验证。 对于 HTML 文件上传,请选择URL 前缀。 输入您网站的 URL,然后点击继续。

pda-google-搜索控制台

4. 在HTML 文件部分,选择要求您下载文件的按钮。

pda-google-search-console-upload-html-verification-file

5. 将 HTML 文件下载到本地计算机后,将文件上传到 WordPress 网站。

保护 HTML 文件和页面

有时保护您的 HTML 文件是必不可少的。 例如,当您只希望管理员或特定用户角色访问文件时。 在这种情况下,PDA Gold 将满足您的需求。

pda-上传-html-wordpress

该插件使您能够保护在 WordPress 根目录下的文件夹中上传的 HTML 文件。 一旦受到保护,未经授权的访问者在尝试访问文件时将被重定向到错误页面。

最酷的是,它允许您使用 iFrame 标记将受保护的 HTML 文件插入到内容中。 这样,您的访问者可以通过 iFrame 查看 HTML,但同时不能直接访问文件。

有关详细步骤,请查看我们的指南,了解如何保护在 iFrame 中显示的 WordPress HTML 文件。

立即充分利用您的 HTML 文件!

这就是您应该了解的有关将 HTML 文件上传到 WordPress 的所有信息。 总而言之,当您需要自定义页面布局时,HTML 文件会派上用场。 在将旧站点迁移到新站点的情况下,这也是一个不错的选择。

最好的部分是在 WordPress 中上传和使用 HTML 文件不是困难的任务。 只需几个简单的步骤,您就可以创建漂亮的网页。 所以,别等了。 立即开始使用您的 HTML 文件!

对于 WordPress 中的 HTML 编辑,您可以参考我们的文章以获取更多信息。

最后,不要忘记订阅我们的网站以获得更多有用的说明!



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有